<template>
  <div>
    <el-button type="primary" @click="handleAdd" v-show="flag">新增</el-button>
    <el-table :data="tableData" style="width: 100%" stripe max-height="580">
      <el-table-column prop="orderBy" label="序号" width="60">
      </el-table-column>
      <el-table-column prop="code" label="code" v-if="flag"> </el-table-column>
      <el-table-column prop="name" :label="type == 1 ? '栏目名称' : '名称'">
      </el-table-column>
      <el-table-column prop="field4" label="英文名称" v-if="type == 1">
      </el-table-column>
      <el-table-column prop="field1" label="二级标题" v-if="type == 1">
      </el-table-column>
      <el-table-column prop="isShow" label="是否显示">
        <template slot-scope="{ row }">
          <span v-show="row.isShow == 0">显示</span>
          <span v-show="row.isShow != 0">隐藏</span>
        </template>
      </el-table-column>
      <el-table-column label="操作" width="180">
        <template slot-scope="{ row }">
          <el-button-group>
            <el-button type="primary" size="mini" @click="handleEdit(row)"
              >编辑</el-button
            >
          </el-button-group>
        </template>
      </el-table-column>
      <div slot="empty" class="emptyBg">
        <el-empty :image-size="200"></el-empty>
      </div>
    </el-table>
    <Pagination
      v-show="parseInt(pageObj.count) > 0"
      :total="parseInt(pageObj.count)"
      @change="getList"
      :page.sync="listQuery.page"
      :limit.sync="listQuery.limit"
    />
  </div>
</template>
<script>
export default {
  data() {
    return {
      listQuery: {
        page: 1,
        limit: 10,
        type: 1,
      },
      tableData: [],
      pageObj: {},
    }
  },
  props: ['flag', 'type'],
  watch: {
    type(v) {
      this.listQuery.type = v
      this.getList()
    },
  },
  mounted() {
    this.getList()
    this.$bus.$on('getSysColumnControl', (v) => {
      this.getList()
    })
  },
  beforeDestroy() {
    this.$bus.$off('getSysColumnControl')
  },
  methods: {
    async getList() {
      let res = await this.$store.dispatch(
        'querySysColumnControl',
        this.listQuery,
      )
      this.tableData = res.data
      this.pageObj = res
      // this.setSession('homeConfig', JSON.stringify(this.tableData))
    },
    handleAdd() {
      this.$bus.$emit('updataTbDictDetail')
    },
    handleEdit(row) {
      this.$bus.$emit('updataTbDictDetail', row)
    },
  },
}
</script>
<style scoped lang="scss">
</style>